import * as THREE from 'three';
import { Scene, CubeTextureLoader } from 'three';
import {  update } from 'three/examples/jsm/libs/tween.module';
import { CSS3DRenderer } from 'three/examples/jsm/renderers/CSS3DRenderer';
import { createCamera,cameraUtil } from './threeCameraUtil';
import { createLight } from './threeLightUtil';
import { controlsUtil,createControls} from './threeControlsUtil'
import { createRenderer, rendererUtil } from './threeRenderUtil'
import { loaderModel,threeGlbExport } from './threeGlbModel';

interface threeExport  {
    element: any,
    width: number,
    height: number,
    scene: Scene | undefined,
    textureCube:CubeTextureLoader| undefined,
    label3DRender: CSS3DRenderer| undefined,
    css3dLabel: object | undefined,
    url:string
}

export const threeExport:threeExport = {
    element: [],
    width: 0,
    height: 0,
    scene:undefined,
    textureCube:undefined,
    label3DRender: undefined,
    css3dLabel: undefined,
    url:'static/model/boy1.glb'
}

export function initThree(id:string) {
    THREE.Cache.enabled = true;
    threeExport.element = document.getElementById(id);
    threeExport.width = threeExport.element.clientWidth;
    threeExport.height = threeExport.element.clientHeight;
    createScene();
    createCamera();
    createLight();
    createRenderer();
    createControls();
    loaderModel(threeExport.url);
}

function createScene() {
    threeExport.scene = new THREE.Scene();
    //threeExport.scene.background = new THREE.Color(0,0,0);
}

function createBox() {
    let mesh = new THREE.Mesh(new THREE.BoxGeometry(5, 5, 5), new THREE.MeshBasicMaterial({
        color:0xffffff
    }))
    threeExport.scene?.add(mesh)
}
export function render() {
    if(controlsUtil.controls){
        controlsUtil.controls.update();
    }
    update();
    if (rendererUtil.renderer) {
        rendererUtil.renderer.setSize(threeExport.width, threeExport.height);
        if (threeExport.scene && cameraUtil.camera) {
            rendererUtil.renderer.render(threeExport.scene,cameraUtil.camera);
        }
    }
    if (threeGlbExport.mixer) {
        var delta:number = threeGlbExport.clock.getDelta(); // clock是THREE.Clock实例，用于计算动画的时间差  
         threeGlbExport.mixer.update(delta); // 更新动画混合器  
    }
    requestAnimationFrame(render);
}








 